<include file="Common/header" />
<link rel="stylesheet" href="__PUBLIC__/editor.md/css/editormd.css" />
<link rel="stylesheet" href="__PUBLIC__/css/page/edit.css?1.1thirdef" />

<div id="layout">
    <!-- 顶部条 -->
    <header class="row">
        <div class="head-left  pull-left">
            <ul class="inline">
                <li>
                    <input type="text" name="page_title" id="page_title" placeholder="{$Think.Lang.input_page_title}" value="{$page.page_title}" tabindex="1">
                </li>
                <li>
                    {$Think.Lang.level_2_directory}：
                    <select name="cat_id" id="cat_id" tabindex="2"></select>
                </li>
                <li id="li_parent_cat">
                    {$Think.Lang.level_3_directory}：
                    <select name="parent_cat_id" id="parent_cat_id" tabindex="3"></select>
                </li>
                <li>
                    <input type="text" name="s_number" id="s_number" value="{$page.s_number}" placeholder="{$Think.Lang.s_number_explain}" title="{$Think.Lang.s_number_explain}"  tabindex="4" >
                </li>
                <li>
                    <!-- 首次添加没有历史版本，不显示 -->
                    <if condition="$page.page_id gt 0">
                        <a href="?s=home/page/history&page_id={$page.page_id}">{$Think.Lang.history_version}</a>
                        <else />
                    </if>
                </li>
            </ul>
        </div>
        <div class="head-right pull-right">
            <!-- <a href="#" class="btn btn-primary " id="save">{$Think.Lang.save}</a> -->
            <div class="btn-group" id="save-btn-group"> 
                <button class="btn btn-primary" id="save">{$Think.Lang.save}</button>
                <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
                <ul class="dropdown-menu" >
                    <li><a href="#" id="add-page-comments">{$Think.Lang.add_page_comments}</a></li>
                    <li><a href="#" id="save-to-templ">{$Think.Lang.save_to_templ}</a></li>
                </ul>
            </div>

            <a href="?s=home/item/show&item_id={$item_id}&page_id={$page.page_id}" class="btn cancel">{$Think.Lang.cancel}</a>
        </div>
    </header>
    <br>
    <!-- 插入模板的按钮组 -->
    <div class="btns">
        <button id="api-doc" tabindex="5" >{$Think.Lang.inser_apidoc_template}</button>
        <button id="database-doc" tabindex="6" >{$Think.Lang.inser_database_doc_template}</button>
        <button id="more-templ" tabindex="7" >{$Think.Lang.more_templ}</button>
<!--         <button id="jsons" tabindex="8" style="margin-left: 100px;">{$Think.Lang.json_to_table}</button> -->
        <div class="btn-group" style="margin-left: 100px;">
          <a class="btn dropdown-toggle" id="json-tools-btn" data-toggle="dropdown" tabindex="8" href="#">
           {$Think.Lang.json_tools}
            <span class="caret"></span>
          </a>
          <ul class="dropdown-menu">
                <li><a id="jsons" >{$Think.Lang.json_to_table}</a></li>
                <li><a id="beautify-json" >{$Think.Lang.beautify_json}</a></li>
          </ul>
        </div>
        <a href="http://runapi.showdoc.cc/" target="_blank" class="btn" tabindex="9" id="runapi">{$Think.Lang.http_test_api}</a>
    </div>
    <div id="editormd">
        <textarea id="page_content" style="display:none;" tabindex="10" >{$page.page_content}</textarea>
    </div>
    <input type="hidden" id="item_id" value="{$item_id}">
    <input type="hidden" id="page_id" value="{$page.page_id}">
    <input type="hidden" id="page_comments" value="">
    <input type="hidden" id="default_second_cat_id" value="{$default_second_cat_id}">
    <input type="hidden" id="default_child_cat_id" value="{$default_child_cat_id}">
</div>
<!-- 模板存放的地方 -->
<div id="api-doc-templ" style="display:none">
    <include file="$api_doc_templ" />
</div>
<div id="database-doc-templ" style="display:none">
    <include file="$database_doc_templ" />
</div>

<div id="json-templ" class="editormd-dialog editormd-preformatted-text-dialog" style="width: 780px; height: 540px;">

    <div style="cursor: move;" class="editormd-dialog-header">
        <strong class="editormd-dialog-title">{$Think.Lang.json_to_table}</strong>
    </div>
    <a class="fa fa-close editormd-dialog-close" href="javascript:closeDiv('#json-templ');"></a>
    <div class="editormd-dialog-container">
        <textarea id="jsons_add" class="jsons" placeholder="{$Think.Lang.json_to_table_description}"></textarea>
        
        <div class="editormd-dialog-footer">
            <button class="editormd-btn editormd-enter-btn">{$Think.Lang.confirm}</button>
            <button class="editormd-btn editormd-cancel-btn" onclick="closeDiv('#json-templ')">{$Think.Lang.cancel}</button>
        </div>
    </div>
    <div class="editormd-dialog-mask editormd-dialog-mask-bg"></div><div class="editormd-dialog-mask editormd-dialog-mask-con"></div>
</div>

<div id="beautify-json-dialog" class="editormd-dialog editormd-preformatted-text-dialog" style="width: 780px; height: 540px;">

    <div style="cursor: move;" class="editormd-dialog-header">
        <strong class="editormd-dialog-title">{$Think.Lang.beautify_json}</strong>
    </div>
    <a class="fa fa-close editormd-dialog-close" href="javascript:closeDiv('#beautify-json-dialog');"></a>
    <div class="editormd-dialog-container">
        <textarea id="beautify-jsons-content" class="jsons" placeholder="{$Think.Lang.beautify_json_description}"></textarea>
        
        <div class="editormd-dialog-footer">
            <button class="editormd-btn editormd-enter-btn">{$Think.Lang.confirm}</button>
            <button class="editormd-btn editormd-cancel-btn" onclick="closeDiv('#beautify-json-dialog')">{$Think.Lang.cancel}</button>
        </div>
    </div>
    <div class="editormd-dialog-mask editormd-dialog-mask-bg"></div><div class="editormd-dialog-mask editormd-dialog-mask-con"></div>
</div>

 <div id="more-templ-modal" class="modal hide fade">
  <div class="modal-header">
    <h4>{$Think.Lang.saved_templ_list}</h4>
  </div>
  <table class="table table-hover" id="templ-table">


  </table>

    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">{$Think.Lang.close}</button>
    </div>
 </div>

<include file="Common/footer" />
<script src="__PUBLIC__/js/jquery.bootstrap-growl.min.js"></script>
<script src="__PUBLIC__/js/jquery.hotkeys.js"></script>
<script src="__PUBLIC__/editor.md/editormd.min.js"></script>
<script src="__PUBLIC__/editor.md/plugins/image-dialog/image-dialog.js"></script>
<script src="__PUBLIC__/editor.md/plugins/link-dialog/link-dialog.js"></script>
<script src="__PUBLIC__/editor.md/plugins/preformatted-text-dialog/preformatted-text-dialog.js"></script>
<script src="__PUBLIC__/editor.md/plugins/code-block-dialog/code-block-dialog.js"></script>
<script src="__PUBLIC__/editor.md/plugins/html-entities-dialog/html-entities-dialog.js"></script>
<script src="__PUBLIC__/editor.md/plugins/goto-line-dialog/goto-line-dialog.js"></script>
<script src="__PUBLIC__/editor.md/plugins/table-dialog/table-dialog.js"></script>
<script src="__PUBLIC__/editor.md/plugins/reference-link-dialog/reference-link-dialog.js"></script>

<script src="__PUBLIC__/js/page/edit.js?v=1.1.2thirdonmopqrstutv12"></script>
<if condition="LANG_SET=='en-us'">
    <script src="__PUBLIC__/editor.md/languages/en.js"></script>
</if>
